Improve var scoping/hoisting description #28068

domleonard · 2023-07-20T03:36:03Z

Description

Remove ambiguity in var Description that can be construed to mean standard scripts have their own scope.

Expand the first sentence ofvar Hoisting to explicitly say that Hoisting occurs during JavaScript compilation.

Motivation

Changes to the description are aimed at preventing readers from inferring that individual scripts have "script" scope.

The change to var Hoisting is to explicitly indicate that var declarations (and hoisting) don't take effect until the script is compiled - in words that do not touch on the semantics of host environment support for separate compilation of one or more script sources.

See Issue 27966 for a case study (on Stack Overflow) involving both of these proposals.

Related issues and pull requests

Fixes #27966

files/en-us/web/javascript/reference/statements/var/index.md

Josh-Cena · 2023-07-20T07:35:20Z

files/en-us/web/javascript/reference/statements/var/index.md

@@ -81,7 +84,7 @@ The list that follows the `var` keyword is called a _{{glossary("binding")}} lis

 ### Hoisting

-`var` declarations, wherever they occur, are processed before any code is executed. Declaring a variable anywhere in the code is equivalent to declaring it at the top. This also means that a variable can appear to be used before it's declared. This behavior is called [_hoisting_](/en-US/docs/Glossary/Hoisting), as it appears that the variable declaration is moved to the top of the function or global code.
+`var` declarations, wherever they occur, are processed during JavaScript compilation before any code is executed. Declaring a variable anywhere in the code is equivalent to declaring it at the top. This also means that a variable can appear to be used before it's declared. This behavior is called [_hoisting_](/en-US/docs/Glossary/Hoisting), as it appears that the variable declaration is moved to the top of the function or global code.


I try to avoid the concept of "JavaScript compilation" because it's very ambiguous. Is it JIT? Is it realm initialization? Is it source parsing? In fact, var declarations are processed as the first step of execution, just before user-visible evaluation. See for examle: https://tc39.es/ecma262/#sec-source-text-module-record-initialize-environment

The latest changes to "Description" resolve that part of the issue I was concerned about.

For Hoisting I'm happy to leave out "JavaScript Compilation" altogether. The version below changes

the first sentence to imply "script" means lines of code within a single script source.

the last sentence to not say that hoisting may move declarations to the top of global code.

### Hoisting

var declarations, wherever they occur in a script, are processed before any code for the script is executed. Declaring a variable anywhere in the code is equivalent to declaring it at the top. This also means that a variable can appear to be used before it's declared. This behavior is called hoisting, as it appears that the variable declaration is moved to the top of the function, static initialization block or script source in which it occurs.

[Sorry about proposing the update here if it should have been done as an edit to the PR - this is my first experience of Git work flow.]

Suggested change

`var` declarations, wherever they occur, are processed during JavaScript compilation before any code is executed. Declaring a variable anywhere in the code is equivalent to declaring it at the top. This also means that a variable can appear to be used before it's declared. This behavior is called [_hoisting_](/en-US/docs/Glossary/Hoisting), as it appears that the variable declaration is moved to the top of the function or global code.

`var` declarations, wherever they occur in a script, are processed before any code within the script is executed. Declaring a variable anywhere in the code is equivalent to declaring it at the top. This also means that a variable can appear to be used before it's declared. This behavior is called [_hoisting_](/en-US/docs/Glossary/Hoisting), as it appears that the variable declaration is moved to the top of the function, static initialization block, or script source in which it occurs.

So you are proposing the change above? This is okay for me. You can click the Commit suggestion button.

In fact I suggest adding another note to specifically point out about multiple scripts:

Suggested change

`var` declarations, wherever they occur, are processed during JavaScript compilation before any code is executed. Declaring a variable anywhere in the code is equivalent to declaring it at the top. This also means that a variable can appear to be used before it's declared. This behavior is called [_hoisting_](/en-US/docs/Glossary/Hoisting), as it appears that the variable declaration is moved to the top of the function or global code.

`var` declarations, wherever they occur in a script, are processed before any code within the script is executed. Declaring a variable anywhere in the code is equivalent to declaring it at the top. This also means that a variable can appear to be used before it's declared. This behavior is called [_hoisting_](/en-US/docs/Glossary/Hoisting), as it appears that the variable declaration is moved to the top of the function, static initialization block, or script source in which it occurs.

> **Note:** `var` declarations are only hoisted to the top of the current script. If you have two `<script>` elements within one HTML, the first script cannot access variables declared by the second one.

I think I committed the last suggestion. And immediately noticed the note could be misconstrued to mean "ever". Here's my suggestion to clarify the note:

Note: var declarations are only hoisted to the top of the current script. If you have two <script> elements within one HTML, the first script cannot access variables declared by the second one when first executed.

Or even better:

**Note: var declarations are only hoisted to the top of the current script. If you have two <script> elements within one HTML, the first script cannot access variables declared by the second before the second script has been processed and executed.

Co-authored-by: Joshua Chen <[email protected]>

files/en-us/web/javascript/reference/statements/var/index.md

Josh-Cena · 2023-07-20T14:36:47Z

@domleonard Is this ready for merge?

github-actions · 2023-07-20T14:37:43Z

Preview URLs

/en-US/docs/Web/JavaScript/Reference/Statements/var

(comment last updated: 2023-07-20 14:37:44)

domleonard · 2023-07-20T23:30:30Z

The preview looks great and I'm happy with merging it. Thank you for all the effort.

Josh-Cena

Great. Thank you for the nice work and congrats on your first contribution here—welcome aboard!

Update index.md

69ccc90

domleonard requested a review from a team as a code owner July 20, 2023 03:36

domleonard requested review from Josh-Cena and removed request for a team July 20, 2023 03:36

github-actions bot added the Content:JS JavaScript docs label Jul 20, 2023

Josh-Cena reviewed Jul 20, 2023

View reviewed changes

files/en-us/web/javascript/reference/statements/var/index.md Outdated Show resolved Hide resolved

Josh-Cena reviewed Jul 20, 2023

View reviewed changes

Update files/en-us/web/javascript/reference/statements/var/index.md

59780c5

Co-authored-by: Joshua Chen <[email protected]>

Josh-Cena reviewed Jul 20, 2023

View reviewed changes

files/en-us/web/javascript/reference/statements/var/index.md Outdated Show resolved Hide resolved

Josh-Cena added 2 commits July 20, 2023 22:35

Update files/en-us/web/javascript/reference/statements/var/index.md

6a056cb

Update files/en-us/web/javascript/reference/statements/var/index.md

4f9ead5

Josh-Cena changed the title ~~Update index.md~~ Improve var scoping/hoisting description Jul 20, 2023

Josh-Cena approved these changes Jul 21, 2023

View reviewed changes

Josh-Cena merged commit cb1edd2 into mdn:main Jul 21, 2023

domleonard deleted the patch-1 branch July 21, 2023 13:03

Josh-Cena mentioned this pull request Nov 20, 2023

Port global var description to let #30388

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Improve var scoping/hoisting description #28068

Improve var scoping/hoisting description #28068

domleonard commented Jul 20, 2023

Josh-Cena Jul 20, 2023

domleonard Jul 20, 2023

Josh-Cena Jul 20, 2023 •

edited

Loading

Josh-Cena Jul 20, 2023

domleonard Jul 20, 2023

domleonard Jul 20, 2023

Josh-Cena commented Jul 20, 2023

github-actions bot commented Jul 20, 2023 •

edited

Loading

domleonard commented Jul 20, 2023

Josh-Cena left a comment

-`var` declarations, wherever they occur, are processed during JavaScript compilation before any code is executed. Declaring a variable anywhere in the code is equivalent to declaring it at the top. This also means that a variable can appear to be used before it's declared. This behavior is called [_hoisting_](/en-US/docs/Glossary/Hoisting), as it appears that the variable declaration is moved to the top of the function or global code.
+`var` declarations, wherever they occur in a script, are processed before any code within the script is executed. Declaring a variable anywhere in the code is equivalent to declaring it at the top. This also means that a variable can appear to be used before it's declared. This behavior is called [_hoisting_](/en-US/docs/Glossary/Hoisting), as it appears that the variable declaration is moved to the top of the function, static initialization block, or script source in which it occurs.
+> **Note:** `var` declarations are only hoisted to the top of the current script. If you have two `<script>` elements within one HTML, the first script cannot access variables declared by the second one.

Improve var scoping/hoisting description #28068

Improve var scoping/hoisting description #28068

Conversation

domleonard commented Jul 20, 2023

Description

Motivation

Related Articles

Related issues and pull requests

Josh-Cena Jul 20, 2023

Choose a reason for hiding this comment

domleonard Jul 20, 2023

Choose a reason for hiding this comment

Josh-Cena Jul 20, 2023 • edited Loading

Choose a reason for hiding this comment

Josh-Cena Jul 20, 2023

Choose a reason for hiding this comment

domleonard Jul 20, 2023

Choose a reason for hiding this comment

domleonard Jul 20, 2023

Choose a reason for hiding this comment

Josh-Cena commented Jul 20, 2023

github-actions bot commented Jul 20, 2023 • edited Loading

domleonard commented Jul 20, 2023

Josh-Cena left a comment

Choose a reason for hiding this comment

Josh-Cena Jul 20, 2023 •

edited

Loading

github-actions bot commented Jul 20, 2023 •

edited

Loading